<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>可乐-Blog 首页</title>
    <link rel="shortcut icon" type="image/x-icon" th:href="@{/static_resources/favicon.ico}" />
    <link rel="stylesheet" th:href="@{/static_resources/css/nav.css}">
    <link rel="stylesheet" th:href="@{/static_resources/css/homePage.css}">
</head>
<body>
<div class="navHeader">
    <!--        <div class="lalala">-->
    <div class="navLeft">
        <div class="logo">
            <img th:src="@{/static_resources/img/KeLe.png}" alt="">
            <div class="KeLeWorld">
                <img th:src="@{/static_resources/img/KeLeWorld.png}" alt="">
            </div>
        </div>
        <ul class="navUl">
            <li class="navLi border-B">
                <a class="A">首页</a>
            </li>
            <li class="navLi">
                <a class="A" th:href="@{/to/toClassify}">分类</a>
            </li>
            <li class="navLi">
                <a class="A" th:href="@{/manager/findAllUser}">管理系统</a>
            </li>
        </ul>
    </div>
    <div class="navF11">
        <div class="searchContainer">
            <div class="searchInput">全屏</div>
            <div class="glass">
                <img th:src="@{/static_resources/img/fullScreen.png}" alt="">
            </div>
        </div>
    </div>
    <div class="navMiddle">
        <div class="searchContainer">
            <a th:href="@{/to/toSearch}" class="searchInput">搜索</a>
            <div class="glass">
                <img th:src="@{/static_resources/img/fangdajing.png}" alt="">
            </div>
        </div>
    </div>
    <div class="navRight">
        <div class="workCenter">
            <a class="A" th:href="@{../to/toWrite}" target="_blank">
                创作中心
            </a>
        </div>
        <div class="vip">
            <a class="A" th:href="@{../to/toVipCenter}">会员中心</a>
        </div>
        <div class="headerPictureContainer">
            <div class="headerPicture headerPictures">

            </div>
            <div class="message">
                <h3 class="messageName"></h3><!--后台数据*用户名-->
                <div class="vipTF">vip</div><!--vip-->
                <div class="line"></div><!--下划线-->
                <div class="personalCenterC">
                    <div class="personalCenter">
                        <a class="peopleCenter" th:href="@{/to/toPeopleCenter}">个人中心</a>
                    </div>
                    <div class="personalCenterIco">
                        <img th:src="@{/static_resources/img/icon7.png}" alt="">
                    </div>
                </div>
                <div class="personalCenterO">
                    <div class="personalCenter">
                        <a class="peopleCenter" th:href="@{../blogs/findBlogsByBlogger}">内容管理</a>
                    </div>
                    <div class="personalCenterIco">
                        <img id="OtherPicture" th:src="@{/static_resources/img/neirongguanli.png}" alt="">
                    </div>
                </div>
                <div class="personalCenterO">
                    <div class="personalCenter">
                        <a class="peopleCenter" th:href="@{../to/toMyCollect}">我的收藏</a>
                    </div>
                    <div class="personalCenterIco">
                        <img th:src="@{/static_resources/img/collection.png}" alt="">
                    </div>
                </div>
                <div class="personalCenterO">
                    <div class="personalCenter">
                        <a class="peopleCenter">退出登录</a>
                    </div>
                    <div class="personalCenterIco">
                        <img th:src="@{/static_resources/img/tuichu.png}" alt="">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--        </div>-->
</div>
<div class="w homepageBox">
    <div class="homepageWrap">
        <div class="title">
            <span>精选图片</span>
            <span class="checkMore"><a th:href="@{/static_resources/templates/selectImages.html}">查看更多>></a></span>
        </div>
        <div class="homepage">
            <div class="CarouselMapBox">

                <div class="CarouselMapLeft">

                </div>
                <div class="CarouselMapRight">
                    <div class="CarouselMapImg image">
                        <img th:src="@{/static_resources/img/1.jpg}" alt="">
                    </div>
                    <div class="CarouselMapImg">
                        <img th:src="@{/static_resources/img/2.jpg}" alt="">
                    </div>
                    <div class="CarouselMapImg">
                        <img th:src="@{/static_resources/img/3.jpg}" alt="">
                    </div>
                    <div class="CarouselMapImg">
                        <img th:src="@{/static_resources/img/4.jpg}" alt="">
                    </div>
                    <div class="CarouselMapImg">
                        <img th:src="@{/static_resources/img/5.jpg}" alt="">
                    </div>
                </div>
            </div>
            <div class="randomSentenceBox">
                <video autoplay loop muted th:src="@{/static_resources/img/sky.mp4}">
<!--                    <source class="source" th:src="@{/static_resources/img/sky.mp4}" type="video/mp4"/>-->
                </video>
                <div class="randomSentence">
                    <h4>优美语句</h4>
                    <div class="statement">
                        <div th:each="sen:${sentence}">
                            <div class="say" th:text="${sen.content}"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="topNewsBox">
            <div class="title">
                <span>精选头条</span>
                <span class="checkMore"> <a th:href="@{../blogs/checkBlog}">查看更多>></a></span>
            </div>
            <div class="topNews">
                <div class="topNewsLeft">
                    <div class="topNewLeftSix" onclick="location.href=this.getAttribute('href')" th:each="list:${blogs}" th:href="@{../blogs/findById(id=${list.bid})}">
                        <div class="newsImg">
                            <div th:text="${list.title}"></div>
                        </div>
                        <div class="newsSten">
                           <div th:utext="${list.content}"></div>
                        </div>
                    </div>
                </div>
                <div class="topNewsRight">

                </div>
            </div>
        </div>
        <div class="videoBox">
            <div class="title">
                <span>精选视频</span>
                <span class="checkMore"><a>查看更多>></a></span>
            </div>
            <div class="video">
                <div class="source">
                    <video class="sourceVideo" src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/812358b69886e576c66a01f1f00affe9.mp4" width="100%" height="100%"></video>
                </div>
                <div class="source">
                    <video class="sourceVideo" src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/11c70c96529b6e6938567ec1aa0910e0.mp4" width="100%" height="100%"></video>
                </div>
                <div class="source">
                    <video class="sourceVideo" src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/e25d81c4922fca5ebe51877717ef9b76.mp4" width="100%" height="100%"></video>
                </div>
            </div>
        </div>
        <div class="bestHitBox">
            <div class="title">
                <span>热门推荐</span>
                <span class="checkMore"><a>查看更多>></a></span>
            </div>
            <div class="bestHit">

            </div>
        </div>
    </div>
</div>
<div class="homeRightNav">
    <ul class="w">
        <li>导航</li>
        <li>精选图片</li>
        <li>精选头条</li>
        <li>精选视频</li>
        <li>热门推荐</li>
    </ul>
</div>
<div class="videoWindowContent">
    <div class="videoWindow">
        <div class="deleteS">X</div>
        <video class="BigVideo" src="" controls>

        </video>
    </div>
</div>
<div class="backToTop">
    <img th:src="@{/static_resources/img/arrow.png}" alt="">
</div>
<div style="height: 70px"></div>
<script th:src="@{/static_resources/js/homePage.js}" type="text/javascript"></script>
<script th:src="@{/static_resources/js/nav.js}" type="text/javascript"></script>
<script th:src="@{/static_resources/js/otherLogin.js}" type="text/javascript"></script>
</body>
</html>